  <!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Title</title>
  </head>
  <body>
  <canvas id="c1" width="600" height="400" style="width: 600px; height: 400px;"></canvas>
  <script>
    // 画布
    const canvas = document.getElementById('c1')
    // 画笔
    const ctx = canvas.getContext('2d')
      let LinearGradient = ctx.createRadialGradient(250,150,10,300,200,100)
    LinearGradient.addColorStop(0,'pink')
    LinearGradient.addColorStop(1,'red')
    ctx.fillStyle = LinearGradient
    ctx.arc(300,200,100,0,Math.PI * 2)
    ctx.fill()
  </script>
  </body>
  </html>